import QtQuick 2.0
import QtCharts 2.3
import QtQuick.Layouts 1.3

Item{
    id:itemThis
    width: 850
    height: 580*0.85
    property real minSize:  Math.min(width/850, height/(580*0.85))

    property color colorTypeug: "#FF4042"
    property color colorTypeif: "#a067dA"
    property color colorTypeil: "#ff83d2"
    property color colorTypeusyn:  "#c8b2f3"
    property color colorTypeugd:  "#41cefa"
    property color colorTypeigd: "#fefe00"
    property color colorTypeuk:  "#ff9000"
    property color colorTypep:  "#90c803"
    property color colorTypeq:  "#f795fe"
    property color colorTypef:  "#d700af"
    property color colorTypeus:  "#ffc904"

    onFocusChanged: if(focus) moveAxisToSight()

    GridLayout {
        id: grid
        width: parent.width
        height: parent.height*0.15
        columns: 6
        property real checkboxFontPointsize: 22*main_screen.minSize

        EXC_Normal_CheckBoxSytleClickable {
            text: qsTr("机端电压")
            textSize: grid.checkboxFontPointsize
            checked: true
            onCheckStateChanged: {
                lineUg.visible = checked
            }
        }
        EXC_Normal_CheckBoxSytleClickable {
            textSize: grid.checkboxFontPointsize
            text: "机端电流"
            checked: true
            onCheckStateChanged: {
                lineIf.visible = checked
            }
        }
        EXC_Normal_CheckBoxSytleClickable {
            textSize: grid.checkboxFontPointsize
            text: "励磁电流"
            checked: true
            onCheckStateChanged: {
                lineIl.visible = checked
            }
        }
        EXC_Normal_CheckBoxSytleClickable {
            textSize: grid.checkboxFontPointsize
            text: "同步电压"
            checked: true
            onCheckStateChanged: {
                lineUsyn.visible = checked
            }
        }
        EXC_Normal_CheckBoxSytleClickable {
            textSize: grid.checkboxFontPointsize
            text: "自动给定"
            checked: true
            onCheckStateChanged: {
                lineUgd.visible = checked
            }
        }
        EXC_Normal_CheckBoxSytleClickable {
            textSize: grid.checkboxFontPointsize
            text: "手动给定"
            checked: true
            onCheckStateChanged: {
                lineIgd.visible = checked
            }
        }
        EXC_Normal_CheckBoxSytleClickable {
            textSize: grid.checkboxFontPointsize
            text: "控制信号"
            checked: true
            onCheckStateChanged: {
                lineUk.visible = checked
            }
        }
        EXC_Normal_CheckBoxSytleClickable {
            textSize: grid.checkboxFontPointsize
            text: "有功功率"
            checked: true
            onCheckStateChanged: {
                lineP.visible = checked
            }
        }
        EXC_Normal_CheckBoxSytleClickable {
            textSize: grid.checkboxFontPointsize
            text: "无功功率"
            checked: true
            onCheckStateChanged: {
                lineQ.visible = checked
            }
        }
        EXC_Normal_CheckBoxSytleClickable {
            textSize: grid.checkboxFontPointsize
            text: "电压频率"
            checked: true
            onCheckStateChanged: {
                lineF.visible = checked
            }
        }
        EXC_Normal_CheckBoxSytleClickable {
            textSize: grid.checkboxFontPointsize
            text: "系统电压"
            checked: true
            onCheckStateChanged: {
                lineUs.visible = checked
            }
        }
        EXC_Normal_CheckBoxSytleClickable {
            checkedColor:"#ff6302"
            textSize: parent.checkboxFontPointsize
            text: qsTr("信标开关")
            checked: false
            onCheckStateChanged: {
                markline.menabled = checked
                markline.visible = false
            }
        }
    }

    ChartView {
        id: spline
        width: parent.width
        anchors.top: grid.bottom
        anchors.right: parent.right
        anchors.bottom: parent.bottom
        anchors.left: parent.left
        antialiasing:true
        legend.alignment:Qt.AlignRight
        legend.font.pointSize: height/30
        legend.color: "#40ffff"
        legend.labelColor: "#40ffff"
        legend.font.family: "Arial"
        localizeNumbers: true
        backgroundColor: "#00000000"
        property int lineXCounter: 0

        Rectangle{
            id : markline
            visible: false
            color: "#8844fdfd"

            property bool menabled: false
            property int plotw: spline.plotArea.width
            property int ploth: spline.plotArea.height
            property real vug: 0
            property real vif: 0
            property real vil: 0
            property real vusyn: 0
            property real vugd: 0
            property real vigd: 0
            property real vuk: 0
            property real vp: 0
            property real vq: 0
            property real vf: 0
            property real vus: 0

            x : spline.plotArea.x;
            y : spline.plotArea.y; // 默认在最上面

            width: spline.markline_orientation===Qt.Horizontal?plotw:2
            height: spline.markline_orientation===Qt.Horizontal?2:ploth

            Behavior on x {
                NumberAnimation {duration: 100;}
            }

            Text {
                id:markline_text
                text: "ug:\t"+parent.vug.toFixed(2)+"%\nif:\t"+parent.vif.toFixed(2)
                      +"%\nil:\t"+parent.vil.toFixed(2)+"%\nusyn:\t"+parent.vusyn.toFixed(2)
                      +"%\nugd:\t"+parent.vugd.toFixed(2)+"%\nigd:\t"+parent.vigd.toFixed(2)
                      +"%\nuk:\t"+parent.vuk.toFixed(2)+"%\np:\t"+parent.vp.toFixed(2)
                      +"%\nq:\t"+parent.vq.toFixed(2)+"%\nvf:\t"+parent.vf.toFixed(2)
                      +"%\nus:\t"+parent.vus.toFixed(2)
                font.pointSize: 15
                x:10
                color: "#8844fdfd"
                state: "1"

                states: [
                    State {
                        name: "1"
                        PropertyChanges {
                            target: markline_text
                            x:10
                        }
                    },
                    State {
                        name: "2"
                        PropertyChanges {
                            target: markline_text
                            x:-markline_text.width
                        }
                    }
                ]
            }
        }
        function setMarkLine(x)
        {
            //将x的值进行转换
            var p2 = spline.mapToValue(Qt.point(x,0),lineUg);
            if(lineUg.count<3)
            {
                return
            }

            var traverseminnum = 0
            var traversemin = lineUg.at(traverseminnum)
            var traversemaxnum = lineUg.count-1
            var traversemax = lineUg.at(traversemaxnum)
            if(lineUg.at(traverseminnum).x>p2.x
                    && lineUg.at(traversemaxnum).x<p2.x) return
            for(var index=lineUg.count/2; traversemaxnum-traverseminnum>1; )
            {
                if(lineUg.at(index).x>p2.x)
                {
                    traversemaxnum = index
                    traversemax = lineUg.at(index)
                }
                else
                {
                    traverseminnum = index
                    traversemin = lineUg.at(index)
                }
                index = (traversemaxnum+traverseminnum)/2
            }
            var traverseResult
            if(p2.x>(lineUg.at(traversemaxnum).x+lineUg.at(traverseminnum).x)/2)
                traverseResult = traversemaxnum
            else traverseResult = traverseminnum

            //给信标赋值
            markline.vug = lineUg.at(traverseResult).y
            markline.vif = lineIf.at(traverseResult).y
            markline.vil = lineIl.at(traverseResult).y
            markline.vusyn = lineUsyn.at(traverseResult).y
            markline.vugd = lineUgd.at(traverseResult).y
            markline.vigd = lineIgd.at(traverseResult).y
            markline.vuk = lineUk.at(traverseResult).y
            markline.vp = lineP.at(traverseResult).y
            markline.vq = lineQ.at(traverseResult).y
            markline.vf = lineF.at(traverseResult).y
            markline.vus = lineUs.at(traverseResult).y
            //移动信标到栅格
            var traverseResultX = mapToPosition(lineUg.at(traverseResult),lineUg).x
            markline.x = traverseResultX
            if(traverseResultX>spline.width/2) markline_text.state = "2"
            else markline_text.state = "1"
        }

        Timer{
            id:markline_timer
            interval: 5000
            running: false
            repeat: false
            onTriggered: markline.visible = false
        }

        MouseArea {
            id: mouseArea
            property int xMouse
            height: parent.height*0.8
            anchors.top: parent.top
            anchors.right: parent.right
            anchors.left: parent.left

            //存储鼠标x坐标
            acceptedButtons: Qt.LeftButton //只处理鼠标左键
            //接收鼠标按下事件
            onPressed: {
                xMouse = mouseX
                if(markline.menabled)
                {
                    spline.setMarkLine(mouseX)
                    markline.visible = true
                    markline_timer.running = false
                    markline_timer.running = true
                }
            }
            //鼠标按下后改变位置
            onPositionChanged: {
                if(markline.menabled)
                {
                    spline.setMarkLine(mouseX)
                    markline.visible = true
                    markline_timer.running = false
                    markline_timer.running = true
                    return
                }

                var t = (mouseX - xMouse)/height*(axisX.max-axisX.min)*0.7
                xMouse = mouseX
                var max = axisX.max.valueOf()
                var min = axisX.min.valueOf()
                axisX.max = new Date(max-t*1)
                axisX.min = new Date(min-t*1)
            }
            onWheel: {
                var max = axisX.max.valueOf()
                var min = axisX.min.valueOf()
                var t = wheel.angleDelta.y/360;
                var j = (axisX.max.valueOf()-axisX.min.valueOf())
                if(t>0 && j<11000){
                }
                else{
                    axisX.max = new Date(max - Math.floor(j*t/2))
                    axisX.min = new Date(min + Math.floor(j*t/2))
                }
            }
        }

        ValueAxis {
            id: axisY
            gridLineColor: "#2246e09f"
            min: 0
            max: 120
            tickCount: 7
            labelFormat: "%.0f"
            labelsColor: "#41f9f9"
            labelsFont.family: "Arial"
            labelsFont.pixelSize: 20*main_screen.minSize
        }

        DateTimeAxis {
            id: axisX;
            gridLineColor: "#2246e09f"
            format: "HH:mm:ss"; //"yyyy MMM dd";HH:mm mm:ss
            tickCount: 9
            labelsAngle: 10
            labelsColor: "#41f9f9"
            labelsFont.family: "Arial"
            labelsFont.pixelSize: 19*main_screen.minSize
            min: new Date();
            max: new Date(new Date().valueOf()+20000)
        }


        LineSeries {
            name:"Ug"
            color: colorTypeug
            id:lineUg
            axisX: axisX
            axisY: axisY
        }

        LineSeries {
            name:"IF"
            color: colorTypeif
            id:lineIf
            axisX: axisX
            axisY: axisY
        }

        LineSeries {
            name:"IL"
            color: colorTypeil
            id:lineIl
            axisX: axisX
            axisY: axisY
        }

        LineSeries {
            name:"Usyn"
            color: colorTypeusyn
            id:lineUsyn
            axisX: axisX
            axisY: axisY
        }

        LineSeries {
            name:"Ugd"
            color: colorTypeugd
            id:lineUgd
            axisX: axisX
            axisY: axisY
        }

        LineSeries {
            name:"Igd"
            color: colorTypeigd
            id:lineIgd
            axisX: axisX
            axisY: axisY
        }

        LineSeries {
            name:"Uk"
            color: colorTypeuk
            id:lineUk
            axisX: axisX
            axisY: axisY
        }

        LineSeries {
            name:"P"
            color: colorTypep
            id:lineP
            axisX: axisX
            axisY: axisY
        }

        LineSeries {
            name:"Q"
            color: colorTypeq
            id:lineQ
            axisX: axisX
            axisY: axisY
        }

        LineSeries {
            name:"F"
            color: colorTypef
            id:lineF
            axisX: axisX
            axisY: axisY
        }

        LineSeries {
            name:"Us"
            color: colorTypeus
            id:lineUs
            axisX: axisX
            axisY: axisY
        }

        Rectangle{
            width: parent.width*0.05
            height: parent.height*0.45
            color: mouseArea_BExtend.pressed? "#4444fdfd":"#2244fdfd"
            anchors.top: parent.top
            anchors.right: parent.right
            radius: 50*minSize
            Text {
                color: mouseArea_BExtend.pressed? "#88fa9292":"#44fa9292"
                text: qsTr("><")
                font.bold: true
                anchors.fill: parent
                horizontalAlignment: Text.AlignHCenter
                verticalAlignment: Text.AlignVCenter
                font.pixelSize: 35*minSize
            }

            MouseArea {
                id: mouseArea_BExtend
                anchors.fill: parent
                onClicked: {
                    var max = axisX.max.valueOf()
                    var min = axisX.min.valueOf()
                    var step = max - min
                    axisX.max = new Date(max + step)
                    axisX.min = new Date(min - step)
                }
            }
        }

        Rectangle{
            width: parent.width*0.05
            height: parent.height*0.45
            color: mouseArea_BExtend.pressed? "#4444fdfd":"#2244fdfd"
            anchors.right: parent.right
            radius: 50*minSize
            anchors.top: parent.top
            anchors.topMargin: parent.height*0.45
            Text {
                color: mouseArea_BNarrow.pressed? "#88fa9292":"#44fa9292"
                text: qsTr("<>")
                font.bold: true
                anchors.fill: parent
                horizontalAlignment: Text.AlignHCenter
                verticalAlignment: Text.AlignVCenter
                font.pixelSize: 35*minSize
            }

            MouseArea {
                id: mouseArea_BNarrow
                anchors.fill: parent
                onClicked: {
                    var max = axisX.max.valueOf()
                    var min = axisX.min.valueOf()
                    var step = max - min
                    if(step/2>11000)
                    {
                        axisX.max = new Date(max - step/4)
                        axisX.min = new Date(min + step/4)
                    }
                }
            }
        }

        Rectangle{
            width: parent.width*0.04
            height: parent.height*0.8
            color: mouseArea_BLeft.pressed? "#4444fdfd":"#2244fdfd"
            anchors.left: parent.left
            anchors.leftMargin: 0
            anchors.top: parent.top
            radius: 50*minSize
            anchors.topMargin: parent.height*0.05
            Text {
                color: mouseArea_BLeft.pressed? "#88fa9292":"#44fa9292"
                text: qsTr("<")
                font.bold: true
                anchors.fill: parent
                horizontalAlignment: Text.AlignHCenter
                verticalAlignment: Text.AlignVCenter
                font.pixelSize: 35*minSize
            }

            MouseArea {
                id: mouseArea_BLeft
                anchors.fill: parent
                onClicked: {
                    var max = axisX.max.valueOf()
                    var min = axisX.min.valueOf()
                    var step = max - min
                    axisX.max = new Date(max - step/2)
                    axisX.min = new Date(min - step/2)
                }
            }
        }

        Rectangle{
            width: parent.width*0.04
            height: parent.height*0.8
            color: mouseArea_BRight.pressed? "#4444fdfd":"#2244fdfd"
            anchors.right: parent.right
            anchors.rightMargin: 105*parent.width/850
            anchors.top: parent.top
            radius: 50*minSize
            anchors.topMargin: parent.height*0.05
            Text {
                color: mouseArea_BRight.pressed? "#88fa9292":"#44fa9292"
                text: qsTr(">")
                font.bold: true
                anchors.fill: parent
                horizontalAlignment: Text.AlignHCenter
                verticalAlignment: Text.AlignVCenter
                font.pixelSize: 35*minSize
            }

            MouseArea {
                id: mouseArea_BRight
                anchors.fill: parent
                onClicked: {
                    var max = axisX.max.valueOf()
                    var min = axisX.min.valueOf()
                    var step = max - min
                    axisX.max = new Date(max + step/2)
                    axisX.min = new Date(min + step/2)
                }
            }
        }
    }

    function moveAxisToSight()
    {
        var step = axisX.max.valueOf() - axisX.min.valueOf()
        var t_date = new Date
        axisX.max = new Date(t_date.valueOf() + step/2)
        axisX.min = new Date(t_date.valueOf() - step/2)
    }

    function addLinePointSingal(newTimeValueOf, whichLine, vary){

        var max = axisX.max.valueOf()
        var min = axisX.min.valueOf()

        if(vary<0) vary = 0

        if(spline.lineXCounter>2000){
            whichLine.remove(0)
        }
        whichLine.append(newTimeValueOf, vary)
        if(newTimeValueOf<axisX.max.valueOf() && (newTimeValueOf+2000)>axisX.max){
            var step = axisX.max.valueOf() - axisX.min.valueOf()
            axisX.max = new Date(max + step/2)
            axisX.min = new Date(min + step/2)
        }
    }

    function addLinePoint(newTimeValueOf, ug, ig, il, usyn, ugd, igd, uk, p, q, f, us){
        spline.lineXCounter++
        addLinePointSingal(newTimeValueOf,lineUg,ug)
        addLinePointSingal(newTimeValueOf,lineIf,ig)
        addLinePointSingal(newTimeValueOf,lineIl,il)
        addLinePointSingal(newTimeValueOf,lineUsyn,usyn)
        addLinePointSingal(newTimeValueOf,lineUgd,ugd)
        addLinePointSingal(newTimeValueOf,lineIgd,igd)
        addLinePointSingal(newTimeValueOf,lineUk,uk)
        addLinePointSingal(newTimeValueOf,lineP,p)
        addLinePointSingal(newTimeValueOf,lineQ,q)
        addLinePointSingal(newTimeValueOf,lineF,f)
        addLinePointSingal(newTimeValueOf,lineUs,us)
        if(spline.lineXCounter>2000)
            spline.lineXCounter--
    }

}




/*##^##
Designer {
    D{i:0;formeditorZoom:0.75}
}
##^##*/
